WHITEPAPER CLOUDFLARE 


Getting Faster: Know 
your website, and know 
what’s slowing it down 


Factors that impact web performance, and steps 
businesses can take to assess and improve the 
performance of their web properties. 
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PART 1 


Why is performance 
important? 


A website or web application’s performance directly impacts 
its ability to generate revenue. 


This impact stems from several factors. Most immediately, a 
page that loads slowly or otherwise performs poorly will see 
worse user engagement — specifically, higher bounce rates 
and less time spent on pages. Similarly poor performance 
reduces conversion rates of various kinds. In addition, 

page performance is an important contributor to organic 
search rankings. And all of these factors present additional 
challenges in the context of mobile device experiences. 
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PART 1: WHY IS PERFORMANCE SO IMPORTANT? 


& USERENGAGEMENT 


Research shows that users are quick to abandon applications and websites that load slowly or fail 
to load altogether: 


e The BBC discovered that 10% more site visitors left for every additional second it took for their 
webpages to load.' 


e 39% of users stop engaging with a website if images take too long to load.” 


e Onmobile devices, 53% of visits to webpages are likely to be abandoned if the pages take 
longer than 3 seconds to load.? 


Conversely, by improving page load speed on mobile, U.S. Express experienced a 15.65% 
reduction in bounce rates. 


~/| CONVERSION RATE 


Unsurprisingly, conversion rate improvements result in more revenue: Mobify saw an average 
yearly revenue increase of close to $380,000 as a result of their increased conversion rate. 


e Conversions go down 7% due to just one additional second of load time.°® 
e Walmart saw a steep drop in conversion rates as load times increased from 1 to 4 seconds.°® 
e For Pinterest, a 40% reduction in perceived load times increased sign-ups by 15%.’ 


e Even improvements of a few milliseconds make a difference: Mobify found that reducing their 
homepage’s load time by 100 milliseconds resulted in a 1.11% increase in conversions.® 


ORGANIC SEARCH RANKINGS 


Search engine optimization, or SEO, is the practice of making one’s Internet property more visible 
by improving its ranking in organic search results. A higher ranking leads to more visitors — in 
fact, a Backlinko study found that the highest-ranked Google search result sees a clickthrough 
rate 10x higher than the tenth-ranked result, on average.® 


A website’s performance goes a long way towards determining its search ranking. In mid-2021, 
Google began incorporating Core Web Vitals — a set of high-priority web performance metrics — 
into its ranking algorithms. These Core Web Vitals are: 


e Largest Contentful Paint (LCP), which measures loading speed 
e First Input Delay (FID), which measures interactivity 
e Cumulative Layout Shift (CLS), which measures visual stability 


While Google does not share the precise impact Core Web Vitals (or any other factor) has on 
search rankings, their public communications indicate that organizations should treat these 
performance metrics as important priorities.’ 
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PART 1: WHY IS PERFORMANCE SO IMPORTANT? 


0 MOBILE DEVICE EXPERIENCES 


Because mobile presents unique challenges compared to desktop, it should be considered a 
separate aspect of performance: a website or app must be specifically designed for mobile to 
ensure it will perform well on handheld devices. 


Mobile devices have accounted for more Internet connections than desktop computers since 
2016.10 And a Kleiner Perkins survey found that, on average, users spent 3.1 hours per day on 
mobile and 2.2 hours on desktop." 


Consequently, mobile performance is hugely important for businesses: 
e 40% of Internet transactions occur on mobile devices.'? 
e Users abandon 53% of mobile sites if they take over 3 seconds to load. 
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PART 2 


What factors affect 
web performance? 


The Internet today is not what it was even five years ago. Web pages and 
web applications are heavier and more dependent on external resources and 
services. Application backends are more complex thanks to the continued 
evolution of cloud technology and changes in Internet protocols. Users are 
accessing the Internet on a wider variety of devices than ever before. 


As a consequence, maintaining performance has become more of a challenge 
than ever. Let’s take an in-depth look at trends and factors that can impact 
website or application’s performance: 
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PART 2: WHAT FACTORS AFFECT WEB PERFORAMNCE? 


Ll COMPLEX WEB CONTENT 


Webpages have steadily increased in size since the Internet’s inception. In 2021, the average 
desktop webpage had a total page weight of 2.2MB — more than a 4x increase from 201114. 
As technology improves, users expect richer and more personalized user experiences that 
incorporate various types of media. 


To keep users engaged, apps and websites today are adding more and more: 
e Rich media content: such as video and high-quality images. 
e CSS: Style sheets that impact the look and feel of a page. 


e JavaScript: Dynamic webpages and personalized content are the norm. As a result developers 
include even more JavaScript that needs to render. 


e API calls: Increasing API network calls that deliver content or additional functionality from 
multiple third-party sources. 


While these changes make for the richer, more personalized experiences that 
users prefer’, they can also make it more difficult to build Internet properties 
that load efficiently and respond quickly. 
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PART 2: WHAT FACTORS AFFECT WEB PERFORAMNCE? 


sN 

\JZ INCREASED CONSUMER EXPECTATIONS AND THE USAGE OF MOBILE 
Today’s consumers are more connected than ever, which increases the demand on the backend 
infrastructure supporting websites and applications. Users connect to apps and websites from 
around the globe, on all kinds of devices. A 2016 Nielsen survey found that 57% of respondents 
who made an online purchase in the past six months bought from an overseas retailer. 


In addition, mobile is the new benchmark for web performance. But building websites for mobile 
users presents a new set of challenges. For one, mobile performance is constrained by network 
connectivity and availability. Despite the widespread availability of 4G and 5G networks in some 
countries, 60% of mobile connections worldwide take place over 2G.” And in some regions, mobile 
network providers will throttle bandwidth past a certain amount."® Adapting web pages for mobile 
also means screen real estate is a challenge. Webpages have to be designed so that they’re still 
readable and usable on mobile. 


Despite these challenges for developers, mobile users have high performance standards for their 
apps: one study by Dimensional Research found that 49% of users expect apps to respond in 2 
seconds or less, 55% hold the app responsible for performance issues, and 80% indicated they 
will only attempt to use a problematic app three times or less."° 


ah DNS 


Before user devices can connect to Internet properties, the Internet property’s user-facing name 

— its domain name — has to be translated into a machine-readable IP address. For this to occur, 

the user device has to query a DNS resolver that will map the domain name to the IP address and 
send the correct IP address to the device. This process takes time — and reducing that time is an 
important part of optimizing performance. 


In addition to DNS lookups for the main domain name, other DNS queries may be necessary to 
load other resources on each webpage. For instance, if images are hosted on a different domain 
than yours, then loading a webpage will involve querying all those different domains in order to 
load the images. Multiple DNS lookups can add up to several seconds’ delay in some cases. 


DNS providers may not be optimized for speed. If a user’s first stop is to a slow DNS provider a 
long way away, then it will take longer for your website to load. 


Many DNS providers take over 50 milliseconds to resolve each DNS query, while the fastest DNS 
providers will resolve queries in under 20 milliseconds — Cloudflare DNS, for instance, resolves 
queries in under 12 milliseconds on average.”° 


ca 

ORIGIN SERVER HEALTH 

Origin servers are the primary servers that process and respond to incoming client requests for a 
website or application’s content. As websites and applications become more complex, they put a 
greater strain on origin servers. Slow origin server performance results in sluggish performance 
overall, even if the rest of a web property’s infrastructure and content is optimized. 


Research by the Nielsen Norman Group shows that response times should be no longer than 1 
second in order to avoid interrupting a user’s train of thought.” If a server cannot handle at least 1 
request per second, the user will perceive the application as performing slowly. 


In order to meet these thresholds, organizations should keep an eye on: 
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PART 2: WHAT FACTORS AFFECT WEB PERFORAMNCE? 


Unevenly distributed server workloads 


Over-utilized servers will run more slowly, adding unnecessary latency and impacting the user 
experience. If some servers have too much of a workload while other servers are under-utilized, 
the workload needs to be distributed more evenly across the serversin order 

to maximize performance. 


The differences can be stark between an application with effective load balancing and an 
application without it. One SaaS company experienced a 2-3 second improvement in page load 
times after deploying Cloudflare Load Balancing.” 


Server crashes 


Like all computers, servers sometimes crash. A 2017 survey by ITIC Corp found that some servers 
experienced up to 37 minutes of unplanned downtime a year on average, while the most reliable 
servers — IBM Z Systems with Linux — were down for only 0.9 minutes per year.?° 


If there is no strategy in place for failover, server downtime can result in slower service for users, 
or a loss of service altogether. 


Ve NETWORK FACTORS 


The Internet is made up of large interconnected networks. As data travels from one point 

to another, it may pass through any number of routers, switches, and networks to reach its 
destination. Therefore, a number of network factors can slow down or impact performance. 
Some of these factors are outside an organization’s control, but others deserve careful attention: 


Network conditions between servers and users 


Users access Internet properties from all kinds of networks, and network conditions play a huge 
role in how well your website or app performs: 


e Network latency is partially caused by distance. The farther a user is physically from an origin 
server, the more latency there will be. The speed of light is a hard limit on how fast data can 
travel, and data will take from a few milliseconds up to nearly a second to travel from the user 
to the server and back. (The effects of network latency can be somewhat reduced by using a 
CDN — content delivery network — to cache content closer to users.) 


e Network congestion occurs when network traffic exceeds bandwidth at a certain point on 
the network, whether that’s within an Internet Exchange Point (IXP), in a data center, or on 
a LAN router in a home. The resulting network congestion leads to slower Internet speeds for 
anyone connected to the network. Network congestion can be limited to a certain geographic 
area that lacks sufficient infrastructure, or it can affect an entire ISP’s network. 


e Mobile networks are often unreliable, although consumers increasingly rely on them for 
Internet access. The quality of service over a mobile network depends upon the user’s 
location, the amount of bandwidth offered by their cellular provider, and many other factors. 
While mobile networks are improving around the world, some parts of the world still struggle 
with cellular reliability and connectivity.74 
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Internet protocols that impact performance 


Many protocols currently in use on the Internet were not built for the Internet as it exists today — 
specifically, its massive scale, enormous user base, and tremendous volumes of data in transit. 
The following protocols can cause web performance challenges: 


e TCP (Transmission Control Protocol) is the primary protocol used on the web. This transport 
protocol involves a back-and-forth acknowledgement in order to open a connection between 
the client and the server. Once the connection is open, TCP ensures that the transmission is 
reliable by checking that all data arrives and is in order. This emphasis on reliability means that 
TCP is not the fastest transport protocol available — however, most of your website will reach 
users via TCP. 


e UDP (User Datagram Protocol) is a much faster transport protocol than TCP, but it is also 
much less reliable. Unlike TCP, UDP does not open a dedicated connection between devices 
before transmitting data, and it does not ensure that all data packets arrive and are in order. 
UDP is extremely useful for video streaming, voice calls, and other use cases where speed 
matters more than reliability, but its usage is limited to these use cases. 


e HTTPis an application-layer protocol, which means it is the protocol just beneath the surface 
of web applications. All user interactions are translated into HTTP requests that are sent to the 
origin server, and all server responses are also in HTTP. Newer versions of HTTP are faster and 
more efficient: HTTP/2, released in 2015, is faster than HTTP/1.1. If your website is still served 
over HTTP/1.1, users may experience slower performance than they would over HTTP/2. 


e TLS (Transport Layer Security) is a protocol for encrypting Internet traffic and helping 
ensure that devices connect to legitimate servers. While TLS is absolutely necessary for 
security, especially as consumers depend more on the Internet, running older versions of the 
TLS protocol can slow down load times. The latest version of TLS, TLS 1.3, eliminates several 
steps in the protocol for a faster connection. (TLS is also known as SSL, which was the 
protocol’s original name in the 1990s.) 
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PART 3 


What steps can you take to 
assess and improve web 
performance? 


No one strategy will address the performance challenges 
identified in Part 2 of this paper. To better understand 
their website or application’s strengths and weaknesses, 
organizations should consider the following steps: 
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PART 3: WHAT STEPS CAN YOU TAKE TO ASSESS 
AND IMPROVE WEB PERFORAMNCE? 


C+) RUN A SITE SPEED TEST 


How a site performs in a local testing environment is not a good indication of how it will perform 
for users across a variety of network conditions. 


Website speed tests aim to simulate real-world conditions and provide data on how well a website 
actually performs. The best website speed tests should let you Know not just how fast their site or 
application is, but also what aspects of it are slowing performance. 


Speed tests can provide a variety of metrics, including: 


e Load time: how long it takes for a web browser to finish downloading 
and displaying the webpage 


e Time to First Byte (TTFB): how long it takes for the browser to receive the first 
byte of data from the web server 


e Requests: the number of HTTP requests that a browser makes in order to fully load the page 
For more speed test performance metrics, see Appendix: Performance Metrics to Know. 


WebPagetest.org is a well-respected and thorough free testing platform. Google PageSpeed 
Insights can also help you assess your website. 


Additionally, Cloudflare offers a simple testing tool for assessing load time, TTFB, 
and total requests. 


E&E ASSESS ORIGIN SERVER HEALTH AND LOAD 


Monitor server health 


Server performance can degrade for a variety of reasons: Server hardware can break down, or 
server software may become outdated, for instance. The average lifespan of a server is about 5 
years.*° Servers should be monitored constantly to ensure their health and availability. 


Check server load 


If origin servers are overloaded, they will perform slowly. Check the memory utilization of your 
servers. Are some machines working harder than others? Are some servers using all of their 
compute power while others aren’t? To get the most performance out of your servers and utilize 
server resources efficiently, it’s important to balance workloads across multiple servers. 


Offload some content requests via caching 


If every user request has to be fulfilled by the origin servers, they may become overloaded. By 
implementing caching — in the browser, at the network edge (using a CDN), or both — many, if 
not most, round trips all the way to the origin server can be eliminated. 
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AND IMPROVE WEB PERFORAMNCE? 


Y IDENTIFY WHERE SITE TRAFFIC COMES FROM 


One of the principal causes of network latency is distance, so the location of users 
matters a great deal. 


For instance, it takes longer for Internet traffic to travel the nearly 16,000 kilometers from New 
York to Sydney (80 ms) than to travel the 4,000 kilometers from New York to San Francisco (21 
ms).?5 If a website is hosted in the U.S. but most of its users are in Sydney, then those distant 
users will experience slow performance. 


Google Analytics is a helpful tool for determining where users are coming from geographically. 
Once you've identified where site traffic comes from, you can figure out whether or not your web 
property’s infrastructure is set up to serve those locations effectively. 


EN AUDIT AND OPTIMIZE SITE IMAGES 


A user’s browser needs to download images before they can be displayed. The larger an image 
is (in terms of file size, not dimensions), the longer it takes to download. Large images often add 
to the load time of a webpage unnecessarily, as many devices don’t have good enough screen 
resolution or a large enough screen to make very high resolution images necessary. 


Before images can be optimized, you should determine how many images your website has and 
where they are located by conducting an image audit. Following the audit, as many images as 
possible should be optimized — meaning, compressed, resized, and converted to a lossy file 
format such as JPEG. Optimized images will load much more quickly. 


Moz.com has step-by-step instructions for crawling all images on your website, identifying which 
ones need to be optimized, and optimizing them. Screaming Frog’s SEO website crawler is helpful 
for auditing website images. 


There are many free image optimizer tools available online. Adobe Photoshop can also compress 
images and export images in a variety of formats. 


Cloudflare Image Resizing, Mirage, and Polish are the best options for companies that already 
deploy the Cloudflare CDN in order to cache images for faster delivery. Cloudflare Polish can be 
activated in the Speed tab of the Cloudflare Dashboard. 
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PART 3: WHAT STEPS CAN YOU TAKE TO ASSESS 
AND IMPROVE WEB PERFORAMNCE? 


= CHECK THE CURRENT PERFORMANCE OF YOUR DNS PROVIDER 
Identify your DNS provider, and then find out if your provider is giving you the 
best performance possible. 


One of the best resources for measuring DNS performance is DNSPerf. DNSPerf regularly tests all 
authoritative DNS providers and public DNS resolvers. Their results and rankings are available for 
free at dnsperf.com. 


To further improve your users’ DNS experience, they can install Cloudflare’s free DNS resolver 
service, 1.1.1.1, for a faster, privacy-first solution. 


CHECK USER ISP NETWORK PERFORMANCE 


Users may experience slow performance for reasons that have nothing to do with the website or 
app they are using. ISP network performance plays a huge role in the user experience. 


A network speed test tool can help users identify issues with their ISP on their own. Cloudflare 
developed speed.cloudflare.com to help users make sure they are getting the network 
performance they should be getting from their ISP. 
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PART 4 


How Cloudflare solves 
performance issues 


Cloudflare’s network of data centers spans hundreds of 
global cities. Each data center supports the full stack of 
Cloudflare performance and security services, ensuring 
that users and websites everywhere get the same 
performance and security benefits. 


From fast web address lookups to accelerated delivery 
to the origin server, Cloudflare speeds up traffic at 
key points in its journey between servers and users. 
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= DNS AND ISP ISSUES 


Cloudflare is one of the world’s fastest and most reliable authoritative DNS providers.” 
Cloudflare provides fast and secure managed DNS as a built-in service on its network. 
Cloudflare also offers 1.1.1.1, which is a public DNS resolver that keeps DNS queries private. 


For consumers, Cloudflare Warp accelerates Internet access from mobile handsets. The 
Cloudflare Speed Test at speed.cloudflare.com helps users assess their 
ISP network’s performance. 


P NETWORK 


The Cloudflare CDN spans a global network of data centers that cache content closer to users so 
that requests don’t need to travel long distances to origin servers. Cloudflare optimizes network 
traffic speeds in several ways. 


Meanwhile, Argo Smart Routing delivers dynamic web content over the fastest network paths 
available, resulting in noticeably faster delivery and improved user experience. 


Cloudflare supports the latest web standards and protocols, including HTTP/2 and QUIC (HTTP/3) 
for faster application layer data transmission, TLS 1.3 for more efficient SSL encryption. 


Cloudflare supports the use of Signed Exchanges with Google AMP, providing native URL 
attribution when viewed in the AMP viewer. 
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£93 CONTENT OPTIMIZATION 


Cloudflare offers a number of image optimization features, including Image Resizing, Polish, and 
Mirage. Image Resizing allows customers to optimize images by resizing, cropping, compressing, 
or converting them to WebP, a newer image format designed for fast loading. Cloudflare 

also enables parallel streaming of progressive images to speed up delivery of 

multiple images on a page. 


Video is hugely important for user engagement, and Cloudflare has several products and features 
for optimizing video. Cloudflare Stream is an online video platform for streaming media, and 
Stream Delivery ensures videos stream as fast as possible. Cloudflare offers Concurrent 
Streaming Acceleration for live streaming content as well. 


Prioritization, or the order in which the assets on a webpage are loaded, makes a huge difference 
to page load speed. Rocket Loader from Cloudflare optimizes the prioritization of any assets 
that need to load before on-page JavaScript can execute. Cloudflare also supports HT TP/2 
Prioritization in order to control how page assets are prioritized, avoiding the slower default 
prioritization of most browsers. BinaryAST for JavaScript is supported by Cloudflare to speed 

up JavaScript parsing so that it executes faster—crucial for the performance of dynamic or 
personalized webpages. 


Q SERVER HEALTH AND AVAILABILITY 


Cloudflare Load Balancing provides local and global load balancing to reduce latency, either by 
load balancing traffic across multiple servers or by routing traffic to the closest region. It also 
includes health checks with fast failover to rapidly route visitors away from failures. 


Serverless computing has great potential for creating faster, more responsive apps than ever. 
Cloudflare Workers allows developers to build serverless applications that run on Cloudflare’s 
network, closer to your users. Applications built with Cloudflare Workers are always available, with 
low-latency responsiveness. And Cloudflare Pages is front-end web development platform using 
the JAMstack (Javascript, API, and Markup) model to deliver similarly fast performance. 


<> CONCLUSION 

Website and application users want faster, more personalized interactions when they log on or 
pull up an app. It’s possible to build such experiences if you use the right tools. Cloudflare helps 
accelerate millions of Internet properties, enabling companies to offer their customers the best 
possible experience. 


To learn more, visit cloudflare.com/performance. 
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APPENDIX: PERFORMANCE METRICS TO KNOW 


Load time: The time it takes for a web browser to finish downloading and displaying the webpage 
(typically measured in milliseconds). 


Time to First Byte (TTFB): How long it takes for the browser to receive the first byte of data from 
the webserver (measured in milliseconds). 


Requests: The number of HTTP requests for resources that a browser has to make in order to 
fully load the page. 


DOMContentLoaded (DCL): This measures the time it takes for the full HTML code of the page to 
be loaded; images, CSS files, and other assets don’t have to be loaded. 


Time to above-the-fold load: ‘Above the fold’ refers to the area of a webpage that fits in a 
browser window without a user having to scroll down. 


First Contentful Paint (FCP): The time at which content first begins to be ‘painted,’ or rendered, 
by the browser. This can be any aspect of the page, including text, images, or non-white 
background colors. 


Page size: The total file size of all content and assets that appear on the page. 


Round trips: This metric counts the number of round trips necessary to load the webpage. When 
an HTTP request travels all the way from a browser to the origin server, and the server’s HTTP 
response goes all the way back, this constitutes a round trip. 


Render-blocking round trips: A subcategory of round trips. ‘Render blocking’ refers to resources 
that have to be loaded before anything else can be loaded. 


Round trip time (RTT): The amount of time the round trips take. 


Render-blocking resources: Certain resources, like CSS files, block other parts of the page from 
being loaded if they are not yet loaded. The more render-blocking resources a webpage has, the 
more chances there are for the browser to fail to load the page. 
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